//
//  SearchBarView.swift
//  Crypto
//
//  Created by DaleGuo on 2023/9/22.
//

import SwiftUI

struct SearchBarView: View {
    @Binding var text: String // 使用Binding让其他组件可以传递text，例如父view中vm的 @Published searchText

    @FocusState private var isFocusOnText: Bool
    var body: some View {
        HStack {
            Image(systemName: "magnifyingglass")
                .foregroundStyle(text.isEmpty ? Color.theme.secondaryText : Color.theme.accent)
            TextField("Search Your Coin!", text: $text)
                .keyboardType(.asciiCapable)
                .autocorrectionDisabled(true) // 禁用英语修正  不知道为甚么默认keyboardType的不行
                .focused($isFocusOnText)
                .foregroundStyle(Color.theme.accent)
                .overlay(
                    Image(systemName: "xmark.circle.fill")
                        .padding() // 添加这个padding能让用户的点击范围更大(可以为其填充背景色查看)
                        .offset(x: 10.0) // 再稍微靠右
                        .foregroundStyle(Color.theme.secondaryText)
                        .opacity(text.isEmpty ? 0 : 1)
                        .animation(.default, value: text.isEmpty)
                        .onTapGesture {
                            text = ""
//                            UIApplication.shared.endIgnoringInteractionEvents()
                            // 关闭键盘事件 利用ios15最新的FocusState
                            isFocusOnText = false

                        },
                    alignment: .trailing)
        }
        .font(.headline)
        .padding()
        .background(RoundedRectangle(cornerRadius: 25).fill(Color.theme.background))
        .padding()
        .shadow(color: Color.theme.accent.opacity(0.15), radius: 10, x: 0.0, y: 0.0)
        
    }
}

#Preview {
    SearchBarView(text: .constant("")) // constant会返回一个不可变的Binding
}
